/*
* @Author: syyao
* @Date: 2019-05-17 16:36:31
* @Last Modified by: syyao
* @Last Modified time: 2019-05-19 14:41:33
*/
<template>
  <div id="change">
    <h2 class="pageFont">账号管理</h2>
    <div style="margin-top: 1vw;">
      <Row style="margin-bottom: 1.2vw;">
        <i-col span="2"><label>头像修改:</label></i-col>
        <i-col span="4">
           <img style="width: 4vw;margin-top: 1vw;margin-left:0.625vw; border-radius: 3vw;" :src="info.picture">
        </i-col>
        <i-col span="8">
          <my-upload style="margin-top:2.5vw;margin-left:1vw"></my-upload>
        </i-col>
      </Row>
      
  
      <div style="margin-bottom: 1vw;">
        <label>昵 称：</label>
        <Input v-model="Pinfo.nickname" clearable style="width:15vw;margin-left:1vw"/>
      </div>

      <div style="margin-bottom:1vw;">
        <label>性 别：</label>
        <Radio-group v-model="Pinfo.sex" style="margin-left: 1vw">
          <Radio label="male">男</Radio>
          <Radio label="female">女</Radio>
        </Radio-group>
      </div>

      <div style="margin-bottom: 1vw">
        <label>生 日：</label>
        <DatePicker
          type="date"
          :value="Pinfo.birthday"
          placeholder="Select date"
          style="width:15vw;margin-left:1vw"
          @on-change="changDate"
        ></DatePicker>
      </div>

      <Button type="primary" v-on:click="commitChange">提交修改</Button>
    </div>

    <h2 class="pageFont1">修改密码</h2>

    <div style="margin-top: 1vw;">
      <div style="margin-bottom: 1vw;">
        <label>原密码：</label>
        <Input v-model="password.old" clearable type="password" style="width:15vw;margin-left:1vw"/>
      </div>

      <div style="margin-bottom:1vw;">
        <label>新密码：</label>
        <Input v-model="password.new" clearable type="password" style="width:15vw;margin-left:1vw"/>
      </div>

      <Button type="primary" v-on:click="changePassword">确认修改</Button>
    </div>
  </div>
</template>

<script>
import GetUserInfo from "../../js/GetUserInfo";
import cover from "../../js/cover";
export default {
  name: "changePersonalInfo",
  data() {
    return {
      Pinfo: { ...this.info },
      password: {
        new: "",
        old: ""
      }
    };
  },
  props: {
    info: {
      type: Object,
      default: function() {
        return {};
      }
    }
  },
  watch: {
    info: function() {
      this.Pinfo = { ...this.info };
    }
  },
  methods: {
    changDate(data){
      this.Pinfo.birthday=data
    },
    commitChange() {
      let _this = this;
      let params = new URLSearchParams();
      params.append("nickname", this.Pinfo.nickname);
      params.append("birth", this.Pinfo.birthday);
      params.append("sex", this.Pinfo.sex);
      this.http.post(this, "/ChangePersonalInfo", params).then(function(msg) {
        if (msg.data.code === "200") {
          _this.$Message.success("修改成功");
          GetUserInfo.getUserInfo(_this);
        } else {
          _this.$Message.error("修改失败");
        }
      });
    },
    changePassword() {
      let _this = this;
      let params = new URLSearchParams();
      params.append("newpassword", cover.Encrypt(this.password.new))
      params.append("old_password", cover.Encrypt(this.password.old))
      this.http.post(this, "/ChangePassword", params).then(function(msg) {
        if (msg.data.code === "200") {
          _this.$Message.success("修改成功");
        } else {
          _this.$Message.error("修改失败");
        }
      });
    }
  }
};
</script>


<style scoped>
.pageFont {
  margin-top: 2vw;
}
.pageFont1 {
  margin-top: 3vw;
}
#change{
  margin:0 auto;
  width: 88%;
}
</style>
